<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib uri="/struts-tags" prefix="s"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords"
	content="Modern Responsive web template, Bootstrap Web Templates, Flat Web Templates, Andriod Compatible web template, 
Smartphone Compatible web template, free webdesigns for Nokia, Samsung, LG, SonyErricsson, Motorola web design" />
<script type="application/x-javascript">
	
	 addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } 

</script>
<!-- Bootstrap Core CSS -->
<link href="css/bootstrap.min.css" rel='stylesheet' type='text/css' />
<script src="js/jquery.min.js"></script>
<!-- Custom CSS -->
<link href="css/style.css" rel='stylesheet' type='text/css' />
<!-- Graph CSS -->
<!-- Nav CSS -->
<script type="text/javascript">
	function add_device() {
		if(!validate()) {
			return;
		}
	
		// 得到表格节点
		var dev_t = window.opener.document.getElementById("dev_t");
		// 判断表格节点是否有子节点，如果没有则首先加入题头，如果有那么继续
		if(!dev_t.hasChildNodes()) {
			var dev_tr1 = document.createElement("tr");
			var dev_th1 = document.createElement("th");
			var dev_th2 = document.createElement("th");
			var dev_th3 = document.createElement("th");
			dev_th1.innerHTML = "设备使用地点";
			dev_th2.innerHTML = "设备交付日期";
			dev_th3.innerHTML = "操作";
			dev_tr1.appendChild(dev_th1);
			dev_tr1.appendChild(dev_th2);
			dev_tr1.appendChild(dev_th3);
			dev_t.appendChild(dev_tr1);
		}
		// 从第二行开始动态添加设备
		var dev_tr2 = document.createElement("tr");
		/**
		* 1: 设备使用地点
		* 2: 设备使用时间
		* 3: 删除操作
		*/
		var dev_td1 = document.createElement("td");
		var dev_td2 = document.createElement("td");
		var dev_td3 = document.createElement("td");
		
		dev_td1.innerHTML = $("#dev_place").val();
		dev_td2.innerHTML = $("#dev_time").val();
		dev_td3.innerHTML = "<input type='button' value='删除' onclick='del_dev(this)'/>";
		dev_tr2.appendChild(dev_td1);
		dev_tr2.appendChild(dev_td2);
		dev_tr2.appendChild(dev_td3);
		dev_t.appendChild(dev_tr2);
		
		// 每次添加一个设备，父页面的当前设备台套数就添加1
		var dev_count = window.opener.document.getElementById("device_count");
		dev_count.value = parseInt(dev_count.value) + 1; 
		
		window.close();
	}
	
	function validate() {
		var dev_place = document.getElementById("dev_place");
		var dev_time = document.getElementById("dev_time");
		if(dev_place.value == null || dev_place.value == "") {
			document.getElementById("span_place").innerHTML = "请填写设备使用地点！";
			return false;
		} else {
			document.getElementById("span_place").innerHTML = "√";
		}
		if(dev_time.value == null || dev_time.value == "") {
			document.getElementById("span_time").innerHTML = "请选择交付日期！";
			return false;
		} else {
			document.getElementById("span_time").innerHTML = "√";
		}
		return true;
	}
</script>
</head>
<body>
	<div id="wrapper">
		<!-- Navigation -->
		<div id="page-wrapper">

			<div class="xs">
				<div class="well1 white">
					<h3 align="center">
						添加设备信息
					</h3>
					<form id="form1" method="post" action="addDevice">
						<table class="table">
							<tr>
								<td>设备使用地点</td>
								<td><input type="text" name="device.device_place" id="dev_place"/></td>
								<td><span style="color:red;" id="span_place"></span></td>
							</tr>
							<tr>
								<td>设备交付日期</td>
								<td><input type="date" name="device.device_time" id="dev_time"/></td>
								<td><span style="color:red;" id="span_time"></span></td>
							</tr>
						</table>
						
						<div class="form-group" align="center">
							<input type="button" class="btn btn-primary" onclick="add_device();" value="添加设备">
							<input type="button" value="取消" class="btn btn-primary" onclick="window.close();"/>
						</div>
					</form>
				</div>
			</div>
		</div>
		<!-- /#page-wrapper -->
	</div>
	<!-- /#wrapper -->
</body>
</html>
